<template>
  <div class="pro-record-content">
    <el-timeline style="width: 70%;">
      <el-timeline-item v-for="(item, i) in recordList" :key="i" :timestamp="item.recordTime" placement="top">
        <el-card>
          <h4>{{ title }}</h4>
          <p>{{ item.nickname }} {{ statusEnum[item.recordType] }}于 {{ item.recordTime }}</p>
        </el-card>
      </el-timeline-item>
      <!-- <el-timeline-item timestamp="2018/4/3" placement="top">
            <el-card>
                <h4>创建项目</h4>
                <p>王小虎 提交于 2018/4/3 20:46</p>
            </el-card>
            </el-timeline-item>
            <el-timeline-item timestamp="2018/4/2" placement="top">
            <el-card>
                <h4>创建项目</h4>
                <p>王小虎 提交于 2018/4/2 20:46</p>
            </el-card> -->
      <!-- </el-timeline-item> -->
    </el-timeline>
  </div>
</template>
<script>
import FormGroup from '@/views/components/FormGroup'
import { recordApi } from './../../api'
export default {
  name: 'ProRecord',
  components: { FormGroup },
  props: ['id', 'title'],
  data() {
    return {
      recordList: [],
      statusEnum: {
        // 记录类型;1:创建项目;2:编辑项目内容;3:发起审核;4:驳回审核;5:通过审核;6:删除项目;7:还原项目;8:项目下架;9:项目发布;
        '1': '创建项目',
        '2': '编辑项目内容',
        '3': '发起审核',
        '4': '驳回审核',
        '5': '通过审核',
        '6': '删除项目',
        '7': '还原项目',
        '8': '项目下架',
        '9': '项目发布'
      }
    }
  },
  mounted() {
    this.getRecord()
  },
  methods: {
    async getRecord() {
      const { code, data } = await recordApi({ id: this.id })
      console.log(data, '-xxxx')
      if (code === 0) {
        this.recordList = data
      } else {
        this.recordList = []
      }
    }
  }
}
</script>

<style lang="scss" scoped>
    .pro-record-content {
        display: flex;
        justify-content: center;
    }
</style>
